var startTime
var endTime
var cholesterolList = []
var glyceroList = []
var uricList = []
var HDLList = []
var LDLList = []
var timeList = []
var isData = false

$(document).ready(function () {
    GetRequestData(GetRequest())
    $("#chartBtnGroup button:first").addClass("active");
});

function GetRequestData(list){
    if(JSON.stringify(list) != "{}"){
        // console.log(list['id'])
        $("#searchInput").val(list['id']);
        getData(list['id'])
    }
}

function getData(id){
    let time = '00:00:00'
    startTime = $('#start').val() != ''? $('#start').val() + ' ' + time:'2019-01-01' + ' ' + time;//开始时间
    endTime = $('#end').val() != ''? $('#end').val() + ' ' + '23:59:59': laydate.now(1, 'YYYY-MM-DD') + ' ' + time;//结束时间
    $.ajax({
        url: global.apiUrl + '/admin_get_user_xuezhi_one',
        type: 'GET',
        dataType: 'json',
        data: {
            start_time: startTime,
            end_time: endTime,
            userid: id,
        },
        header: {
            'content-type': 'application/json' //默认值
        },
        success: function(res){
            // console.log(res)
            getEchartsData(res)
            
        }
    })
}

function getEchartsData(list){
    if(list.length!=0){
        cholesterolList = []
        glyceroList = []
        uricList = []
        HDLList = []
        LDLList = []
        timeList = []
        for(var i in list){
            cholesterolList.push(list[i].cholesterol)
            glyceroList.push(list[i].glycerol)
            uricList.push(list[i].uric)
            HDLList.push(list[i].hdl)
            LDLList.push(list[i].ldl)
            timeList.push(list[i].date)
        }
        // console.log(arr2)
        isData = true
        $("#chartBtnGroup button:first").click().addClass("active");
    }else{
        alert('无测量数据')
        // $("#chartBtnGroup button:first").addClass("active");
        isData = false
    }
}

function showChart(name){
    $("#chartBtnGroup").children().removeClass("active");
    // console.log(name)
    var title = ''
    var list = []
    switch (name) {
        case 'cholesterol':
            title = '总胆固醇';
            list = cholesterolList;
            $("#chartBtnGroup .chartBtn").eq(0).addClass("active");
            break;
        case 'glycerol':
            title = '甘油三酯';
            list = glyceroList;
            $("#chartBtnGroup .chartBtn").eq(1).addClass("active");
            break;
        case 'uric':
            title = '尿酸';
            list = uricList;
            $("#chartBtnGroup .chartBtn").eq(2).addClass("active");
            break;
        case 'HDL':
            title = 'HDL';
            list = HDLList;
            $("#chartBtnGroup .chartBtn").eq(3).addClass("active");
            break;
        case 'LDL':
            title = 'LDL';
            list = LDLList;
            $("#chartBtnGroup .chartBtn").eq(4).addClass("active");
            break;
    }
    if(isData == true){
        setEcharts(title,list)
    }else{
        alert('暂无测量数据')
    }
}

function clickBtn(){
    if($("#searchInput").val()!= ''){
        getData($("#searchInput").val())
    }else{
        alert('请输入用户ID')
    }
}

function setEcharts(title,list) {
    var lineChart = echarts.init(document.getElementById("echarts-line-chart"));
    var lineoption = {
        title : {
            text: title + '变化趋势',
            subtext: startTime + '~' + endTime,
            textAlign: 'center',
            x: 'center'
        },
        tooltip : {
            trigger: 'axis',
            axisPointer : {
                type : 'line',
                lineStyle : {
                    color: '#bbb',
                    width: 1,
                    type: 'solid'
                },
            },
        },
        grid:{
            x:60,
            x2:60,
            y: 80,
            y2:24
        },
        // calculable : true,
        dataZoom:[
            {
              show: false,
              type:'slider',
              start: dataZoom(timeList),
              end: 100,
              left:'3%',
              right:'3%',
              maxValueSpan: 10,
            },
            {
              type: 'inside',
            },
        ],
        xAxis : [
            {
                show: true,
                type : 'category',
                boundaryGap : false,
                data : timeList,
                axisLine:{
                  show: true,
                  lineStyle:{
                    width:1,
                    color: 'black'
                  }
                },
                axisTick:{
                  show:true
                },
                splitLine:{
                  show: false,
                },
                axisLabel:{
                  show:true,
                  interval: 0,
                  formatter: '{value}',
                  formatter:function(value){
                    // return util.setTime13(value) + '日'
                    return value
                  }
                },
            }
        ],
        yAxis : [
            {
                type : 'value',
                show:true,
                axisLine:{
                  show: true,
                  lineStyle:{
                      width:1,
                      color: 'black'
                  }
                },
                axisTick: {
                  show: true,
                },
                splitLine:{
                  show: true,
                },
                axisLabel:{
                  show: true,
                  inside: false,
                  verticalAlign: 'middle',
                  color: 'black',
                  formatter:function(value,index){
                    return value
                  }
                },
            }
        ],
        
        series : [
            {
                name: title,
                type:'line',
                smooth: true,
                symbol: 'circle',
                symbolSize: 6,
                itemStyle : {
                  normal: {
                    color: 'rgb(26, 179, 148)',
                  },
                },
                emphasis:{
                    label:{
                      show: true,
                      position: 'top',
                      color: 'black',
                    },
                    itemStyle:{
                      borderWidth: 12,
                      borderType:'solid',
                      borderColor: 'rgba(26, 179, 148, 0.5)'
                    }
                },
                data: list
            },
        ]
    };
    lineChart.setOption(lineoption);
    $(window).resize(lineChart.resize);
}